<script setup lang="ts">
import { SubItem } from '../../types'
import SubNavGuide from '../../components/SubNavGuide.vue'
import iPhoneBriefInfo from './components/iPhoneBriefInfo.vue'
import iphonese from './imgs/hero_iphone_se.jpg'
import iphone11 from './imgs/hero_iphone_11.jpg'
import iphone11pro from './imgs/hero_iphone_11_pro.jpg'
import CompareiPhone from './components/CompareiPhone.vue'
import WhyiPhone from './components/WhyiPhone.vue'
import iPhoneFinalInfo from './components/iPhoneFinalInfo.vue'

const subItemList: SubItem[] = [
  {
    iconName: 'iPhoneSE',
    goodName: 'iPhone SE'
  },
  {
    iconName: 'iPhoneX',
    goodName: 'iPhone11 Pro'
  }
]

</script>

<template>
  <SubNavGuide :sub-item-list="subItemList"></SubNavGuide>
  <iPhoneBriefInfo :good-name="'iPhone SE'" :is-new="'yes'" :good-info="'称心称手，超值入手。'"
    :price-info="'折抵换购，仅 RMB 90/月或RMB 2149 起*。'" :buy-info="'RMB 3299 起'" :img-src="iphonese">
  </iPhoneBriefInfo>
  <iPhoneBriefInfo :good-name="'iPhone11'" :reverse-direction="true" :good-info="'一切都刚刚好。'"
    :price-info="'折抵换购，仅 RMB 167/月或 RMB 3999 起*。'" :buy-info="'RMB 3999 起'" :img-src="iphone11">
  </iPhoneBriefInfo>
  <iPhoneBriefInfo :good-name="'iPhone11Pro'" :is-new="'yes'" :good-info="'摄像头、显示屏、性能，样样 Pro 如其名。'"
    :price-info="'折抵换购，仅 RMB 273/月或 RMB 6549 起*。'" :buy-info="'RMB 6549 起'" :img-src="iphone11pro">
  </iPhoneBriefInfo>
  <CompareiPhone></CompareiPhone>
  <WhyiPhone></WhyiPhone>
  <iPhoneFinalInfo></iPhoneFinalInfo>
</template>

<style scoped lang="less"></style>
